<!-- svg_骨架 -->
<template>
  <div>
    <svg width="3.75rem" height="2.7rem" viewBox="0 0 375 270" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
        <!-- Generator: Sketch 47 (45396) - http://www.bohemiancoding.com/sketch -->
        <desc>Created with Sketch.</desc>
        <defs>
            <path d="M7,15 C10.8659932,15 14,11.8659932 14,8 C14,4.13400675 10.8659932,1 7,1 C3.13400675,1 0,4.13400675 0,8 C0,11.8659932 3.13400675,15 7,15 Z" id="path-1"></path>
        </defs>
        <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
            <g id="损伤_骨架" transform="translate(0.000000, -125.000000)">
                <g id="Group-6" transform="translate(0.000000, 125.000000)">
                    <rect id="Rectangle" fill="#FFFFFF" x="0" y="0" width="375" height="270"></rect>
                    <g id="Group-3" transform="translate(48.000000, 47.000000)" stroke-linecap="round" stroke="#B2B2B2" stroke-width="0.5" stroke-linejoin="round">
                        <g id="Group-5" transform="translate(0.000000, 30.000000)">
                            <path :fill='skeleton4' d="M177.142857,61.765541 C167.319284,66.7050125 158.499316,71.1646329 156.512837,72.1529248 C151.944583,74.4256729 148.456306,76.0651782 146.096981,79.2318871 C143.737657,82.3985961 127.111569,107.992491 125.841126,110.243966 C124.570683,112.495441 123.905283,115.064527 122.040213,122.042072 C120.175143,129.019616 119.952774,138.764887 120.996493,142.240073 C122.040213,145.71526 125.253196,148.532212 125.253196,152.021217 L125.253196,158.764664 L129.498488,156.828638 C127.923502,154.892611 126.534887,151.141738 126.727495,146.684964 C126.920104,142.228189 128.851111,132.397582 131.893028,120.010517 C134.934945,107.623453 143.508577,91.716805 148.100771,84.9392011 C152.692965,78.1615972 162.192284,73.8876285 167.054607,71.1125466 C168.432582,70.3260924 172.296543,68.4136392 177.142857,66.0666588 L177.142857,61.765541 L177.142857,61.765541 Z" id="Path"></path>
                            <path :fill='skeleton6' d="M182.040816,59.3050318 C193.38982,53.6096342 204.79768,47.9293164 207.732288,46.6421432 C211.695003,44.9040235 217.366979,43.8040939 224.748216,43.3423543 L244.020738,63.5363653 L231.282815,68.8041086 C220.56047,57.6382868 214.597753,51.5105801 213.394662,50.4209886 C211.590026,48.7866013 209.146071,50.6722092 208.43918,51.1073814 C207.996639,51.3798159 193.794246,58.0640253 182.040816,63.7060944 L182.040816,59.3050318 Z" id="Path"></path>
                            <g id="Group-2" transform="translate(191.020408, 2.448980)">
                                <path d="M52.9915346,61.1275451 L0.776246599,6.37921202 L22.4736286,0.76771658 L22.4736286,0.76771658 C25.2635634,0.0461684121 28.2303097,0.70424223 30.4534834,2.5377815 L84.9947635,47.5201311 L52.9915346,61.1275451 Z M49.8999399,57.8859723 L75.9805008,46.6705947 L25.7391032,6.56738134 L6.90130103,12.8014024 L49.8999399,57.8859723 Z" id="Combined-Shape"></path>
                                <path :fill='skeleton10' d="M49.8999399,57.8859723 L6.90130103,12.8014024 L25.7391032,6.56738134 L75.9805008,46.6705947 L49.8999399,57.8859723 Z M11.866232,18.0071899 L49.8999399,57.8859723 L64.5703624,51.5772764 L23.1552323,13.3308623 L11.866232,18.0071899 Z" id="Combined-Shape"></path>
                                <path d="M11.866232,18.0071899 L49.8999399,57.8859723 L64.5703624,51.5772764 L23.1552323,13.3308623 L11.866232,18.0071899 Z" id="Combined-Shape"></path>
                            </g>
                            <polygon id="Rectangle-2" :fill='skeleton5' points="177.142857 61.7576239 182.040816 59.3278287 182.040816 130.765041 177.142857 133.159321"></polygon>
                            <path :fill='skeleton7' d="M128.979592,13.4147193 C119.737518,16.8539527 108.678988,21.1110323 107.284784,21.6242747 C105.120609,22.4209632 100.592393,23.4792819 97.4288875,26.2392382 C95.3198839,28.0792092 83.2428435,39.6046523 61.1977664,60.8155676 L68.8186007,63.8765018 C84.5943273,48.2380446 93.964556,39.0385447 96.9292868,36.2780022 C101.376383,32.1371885 102.234329,31.2632389 108.540457,28.3497775 C110.787298,27.3117263 117.600343,24.8395769 128.979592,20.9333295 L128.979592,13.4147193 L128.979592,13.4147193 Z" id="Path"></path>
                            <path :fill='skeleton9' d="M135.510204,11.0170362 C137.757898,10.2077202 139.586784,9.57328991 140.695969,9.23329977 C146.492347,7.45658083 165.150137,1.53505601 170.778406,0.795752648 C176.406675,0.0564492849 182.958046,-0.0186391315 185.276074,2.12231467 C186.821426,3.54961721 191.04599,7.92807314 197.949765,15.2576825 C186.892309,16.9478987 180.859062,18.0797383 179.850023,18.6532015 L169.112254,7.4603025 C155.721216,11.8962099 144.520533,15.6441972 135.510204,18.7042644 L135.510204,11.0170362 L135.510204,11.0170362 Z" id="Path"></path>
                            <polygon id="Rectangle-3" :fill='skeleton8' points="128.979592 13.4159182 135.510204 11.0001082 135.510204 53.4570209 128.979592 56.7588339"></polygon>
                            <path d="M124.555895,113.001466 L90.1778777,85.0962376 L68.7848098,63.8958223 L61.3345382,60.756555 C42.1595871,70.0264889 31.1430436,75.3193499 28.2849077,76.6351381 C23.9977038,78.6088204 13.9879872,84.1847842 8.48379111,86.8955228 C2.97959504,89.6062614 2.24339425,90.9529012 1.86681553,95.1871156 C1.61576305,98.0099251 1.61576305,102.152644 1.86681553,107.615273 L0.744144642,109.301399 L0.744144642,116.605118 L59.8743952,178.602362 C62.5853269,178.85409 64.2334401,178.99389 64.8187348,179.021761 C65.6966768,179.063568 71.3857514,176.350257 72.0337562,174.974763 C72.6817611,173.599269 72.5719763,171.844833 72.810772,169.300791 C73.0495677,166.75675 75.5475843,161.724697 84.6731824,154.973048 C93.7987805,148.2214 118.100489,146.407201 125.201852,158.698021 C125.298556,156.42963 125.308839,154.295947 125.232703,152.296972 C125.118497,149.298511 124.151586,147.75559 122.462651,145.312059 C120.773717,142.868527 120.419016,140.346388 120.43128,135.987428 C120.443543,131.628468 120.84911,127.981505 121.498317,124.373885 C121.931121,121.968805 122.950314,118.177999 124.555895,113.001466 Z" id="Path-67"></path>
                            <path d="M129.497262,156.827766 C127.803215,154.700021 126.919106,152.38694 126.844937,149.888525 C150.944726,137.751009 165.052483,130.42727 169.168207,127.917309 C175.341794,124.152367 177.196733,118.284313 177.196733,116.608581 L177.196733,133.134122 L129.497262,156.827766 Z" id="Path-64"></path>
                            <path d="M182.056713,130.74337 L182.056713,121.146021 L206.304439,109.347256 C208.023847,101.936027 210.488595,96.1093561 213.698686,91.8672425 C216.908776,87.625129 222.438332,83.4439773 230.287352,79.3237873 L231.330194,68.7421168 L276.036799,49.9690897 C277.411266,51.020571 278.430877,52.1261264 279.095633,53.2857559 C280.092767,55.0252001 279.933827,58.4776899 279.933827,59.5597646 C279.933827,60.2811477 279.933827,65.7210015 279.933827,75.879326 C269.810229,85.2575246 263.325281,90.7426261 260.478983,92.3346305 C256.209535,94.7226371 255.681007,94.3407136 254.466733,92.8103958 C253.252459,91.280078 254.204445,87.9019786 249.687127,86.0377659 C245.169809,84.1735532 238.081983,82.8829975 230.287352,86.9430273 C222.49272,91.003057 214.554541,101.627782 212.867315,114.661611 L182.056713,130.74337 Z" id="Path-65"></path>
                            <path d="M198.020073,15.2382886 C185.201431,17.3315826 177.238937,18.9851253 174.132592,20.1989167 C169.473075,22.0196037 161.964955,26.6345354 158.655836,31.081507 C155.346718,35.5284786 151.128783,42.7403781 150.32685,45.9560498 L130.303568,56.0538085 L89.5228656,79.1571727 L71.7725701,60.9756321 L68.6829922,63.9442667 L90.402819,85.2074884 L160.104073,44.8809263 C161.976546,37.1818519 165.720095,31.5847627 171.33472,28.0896589 C179.756659,22.8470032 187.259791,22.4699566 192.639932,23.9633751 L202.989572,20.4595468 L198.020073,15.2382886 Z" id="Path-66"></path>
                            <path d="M112.990247,114.256791 L60.7745927,68.5859789 C31.0304083,82.8911962 14.996628,90.5029983 12.6732519,91.4213851 C10.3498758,92.3397718 10.5046001,93.7812205 13.137425,95.7457312 C18.9548501,101.929685 22.5592278,105.588897 23.950558,106.723366 C26.0375533,108.42507 28.2807265,108.391773 30.0644831,108.42507 C31.8482398,108.458367 32.8756837,109.838995 34.3526342,111.348053 C35.8295847,112.857111 57.7697919,137.665599 61.4015205,141.567666 L112.990247,114.256791 Z" id="Path-68"></path>
                            <path :fill='skeleton2' d="M94.0019122,124.309143 L61.4015205,141.567666 C60.0030265,140.065071 55.8896769,135.462387 51.2753664,130.2838 L83.5863504,113.469388 L94.0019122,124.309143 Z" id="Combined-Shape"></path>
                            <path :fill='skeleton1' d="M41.4091866,119.204584 C37.7108126,115.054544 34.8537721,111.860085 34.3526342,111.348053 C32.8756837,109.838995 31.8482398,108.458367 30.0644831,108.42507 C28.2807265,108.391773 26.0375533,108.42507 23.950558,106.723366 C22.5592278,105.588897 18.9548501,101.929685 13.137425,95.7457312 C10.5046001,93.7812205 10.3498758,92.3397718 12.6732519,91.4213851 C14.996628,90.5029983 31.0304083,82.8911962 60.7745927,68.5859789 L61.1016208,68.8720164 L61.1016208,90.0462403 L73.207825,102.787044 C72.5675129,103.299737 61.9679668,108.772251 41.4091866,119.204584 Z" id="Combined-Shape"></path>
                            <path d="M83.9790612,113.893435 L72.8004869,102.363815" id="Path-71"></path>
                            <polyline id="Path-72" :fill='skeleton3' points="64.8282788 178.89805 64.8282788 170.419573 1.73509907 107.791151"></polyline>
                            <path d="M43.4333794,155.889491 L15.5200734,126.990674" id="Path-75"></path>
                            <polygon id="Path-73" points="48.1809052 163.410599 50.7169228 163.410599 50.7169228 160.346587 45.7977697 155.577147 43.1055924 155.577147 43.1055924 158.455863"></polygon>
                            <polygon id="Path-74" points="7.53802822 118.465189 9.73440603 118.465189 15.7828005 124.283778 15.7828005 127.141294 13.1849634 127.141294 7.53802822 121.36149"></polygon>
                            <path d="M146.962579,78.1014361 L99.8109352,33.7653929 C101.213533,32.3790565 102.647867,31.3254201 104.113938,30.6044839 L150.164555,75.5373186 C149.523161,75.9767737 149.070516,76.3021645 148.806619,76.513491 C148.542722,76.7248175 147.928042,77.2541325 146.962579,78.1014361 Z" id="Path-76" fill="#FFFFFF"></path>
                            <path d="M75.2125703,163.969144 C76.2552577,156.811934 80.3484783,150.975598 87.4922322,146.460133 C98.2078631,139.686937 107.772736,141.525843 111.075398,141.782457 C114.37806,142.039071 122.240504,144.865347 124.005085,147.927414" id="Path-2"></path>
                        </g>
                        <g id="Group-4" transform="translate(1.000000, 0.000000)">
                            <path d="M3.79751281,0 L7.4078455,3.62800115 C17.5541934,5.16242239 25.3561706,6.03689626 30.8137771,6.25142275 C39.0001869,6.57321248 52.696876,6.70529697 57.0709285,5.92963301 C61.444981,5.15396906 70.3524322,3.62800115 72.1596835,3.62800115 L77.017086,0.136974584 C79.0310447,3.14064092 80.0251877,5.91766563 79.9995153,8.46804872 C79.9610066,12.2936234 79.9995153,44.2656052 79.9995153,47.353191 C79.9995153,50.4407767 77.3508278,56.4772153 71.4957411,57.9842195 C65.6406544,59.4912238 55.7943789,61.0421583 40,60.9991246 C24.2056211,60.9560909 9.04418751,57.9842195 5.66916946,56.7096734 C2.29415141,55.4351272 0.0490946464,52.4012025 0.00842330965,48.0617945 C-0.0322480271,43.7223865 0.0897659832,13.3118809 0.0490946464,9.37922511 C0.0219804219,6.75745459 1.27145314,3.63104622 3.79751281,0 Z" id="Path-77"></path>
                            <path d="M72.1137337,3.62830856 C74.0379112,4.86090217 75,6.81015748 75,9.47607449 C75,14.6635133 75,36.2706466 75,44.6800855 C75,53.0895243 70.5783753,53.8890483 66.2091209,54.9652297 C61.8398666,56.0414111 49.7857939,57 38.2899887,57 C26.7941835,57 16.8328282,55.9427174 10.3933758,53.7315584 C3.95392331,51.5203994 4.00000918,49.0598812 4.00000918,44.6800855 C4.00000918,40.3002897 4.00000918,13.3716066 4.55932401,9.28946688 C4.85901484,7.10218391 5.78117739,5.18755024 7.32581169,3.54556588 L7.4078455,3.62800115 C17.5541934,5.16242239 25.3561706,6.03689626 30.8137771,6.25142275 C39.0001869,6.57321248 52.696876,6.70529697 57.0709285,5.92963301 C61.4090641,5.16033831 70.2064535,3.65301108 72.1137337,3.62830856 Z" id="Combined-Shape"></path>
                        </g>
                    </g>
                    <text id="1" font-family="PingFangSC-Medium, PingFang SC" font-size="10" font-weight="400" letter-spacing="0.189999998" fill="#FFFFFF">
                        <tspan x="162.537286" y="127.461684">1</tspan>
                    </text>
                </g>
            </g>
        </g>
    </svg>
  </div>
</template>
<script>
  export default {
    name: 'svg_skeleton',
    props: ['nodeContent'],
    data () {
      return {
        skeleton1: "",  //水箱上支架
        skeleton2: "",  //水箱下支架
        skeleton3: "", //前横梁
        skeleton4: "",  //左A柱
        skeleton5: "",  //左B柱
        skeleton6: "",  //左C柱
        skeleton7: "",  //右A柱
        skeleton8: "",  //右B柱
        skeleton9: "",  //右C柱
        skeleton10: "", //后横梁
        nodeInfor: this.nodeContent
      }
    },
    components: {
		},
    methods: {
      checkNode () {
        this.nodeInfor.map((val,index) => {
          switch (val.recessive){
            case "无损伤":
              this["skeleton" + val.dictValue] = "#fff";
              break;
            case "喷漆":
              this["skeleton" + val.dictValue] = "#FFD900";
              break;
            case "钣金":
              this["skeleton" + val.dictValue] = "#F60000";
              break;
            case "更换":
              this["skeleton" + val.dictValue] = "#ACCFFF";
              break;
          }
        })
      }
    },
    mounted(){

    },
    watch:{
      'nodeInfor': 'checkNode',
    }
  }
</script>

<style scoped>

</style>
